<template>
  <div class='depotEnter'>
    <searchButton type="到店高管审核"></searchButton>
   <div class="page">
    <div class="page__bd">
      <div class="weui-tab">
        <div class="weui-navbar">
          <block v-for="(item,index) in tabs" :key="index">
            <div :id="index" :class="{'weui-bar__item_on':activeIndex == index}" class="weui-navbar__item" @click="tabClick">
              <div class="weui-navbar__title">{{item}}</div>
            </div>
          </block>
          <div class="weui-navbar__slider" :class="navbarSliderClass"></div>
        </div>
        <div class="weui-tab__panel">
            <!-- :hidden="activeIndex != 0" -->
          <div class="weui-tab__content">
              <listOdd :data="data" :type="'到店高管审核'"></listOdd>
          </div>
        </div>
      </div>
    </div>
  </div>



  </div>
</template>

<script>
  import listOdd from '@/components/common/listOdd.vue';
  import searchButton from '@/components/common/searchButton.vue';
  export default {
    components: {
      listOdd,
      searchButton
    },
    data() {
      return {
        tabs: ["处理中", "已完成"],     
        activeIndex: 0,     //tab切换
        data:[]
      }
    },
    computed: {
      navbarSliderClass() {
        if (this.activeIndex == 0) {
          return 'weui-navbar__slider_0'
        }
        if (this.activeIndex == 1) {
          return 'weui-navbar__slider_1'
        }
      }
    },
    methods: {
      tabClick(e) {
        this.activeIndex = e.currentTarget.id;
        //切换tab，更换data

      }
    },
     mounted(){
        this.$https.get("http://rap2api.taobao.org/app/mock/22254/lyl/xiaochengxu/list",{page:1,rows:10,token:1000}).then(res=>{
               this.data = res.data.data ;
        })
    },
  }
</script>


<style lang="scss" scoped>
  .depotEnter {
    height: 100%;
  }
</style>